Dyr og Data

Quarto presentations

There are three currently-supported formats for making presentations using Quarto

1. reveal.js

2. MS PowerPoint

3. LaTeX Beamer

Quarto presentations

Each of these requires some unique knowledge

1. reveal.js — to go beyond applying a theme you need to know a little about Cascading Style Sheets (CSS)

2. MS PowerPoint — to do any real styling you need to know how to create PowerPoint template files

3. LaTeX Beamer — to go beyond simple formatting and a few very formal themes, you need to know quite a bit about LaTeX and the Beamer LaTeX package

Of these, reveal.js is the easiest to learn and get to grips with

reveal.js presentations

To create a reveal.js presentation we use the revealjs format provided by quarto

---
title: "My Amazing Presentation"
author: "Alice"
format:
  revealjs: default
---

This is slightly different to how the book shows it; I want us to get used to the idea that format: is a list of one or more formats that you can render your slides to.

Note the indentation; revealjs: default is indented by 2 spaces, indicating it is an element of format:

reveal.js presentations

To indicate a new slide, we use a level 2 heading ## Title

---
title: "My Amazing Presentation"
author: "Alice"
format:
  revealjs: default
---

## Slide 1

* Bullet 1
* Bullet 2
* Bullet 3

## Slide 2

Some very insightful point I wish to make at this point in the presentation

This can be changed with the slide-level option

reveal.js presentations

The level 1 header # Title is used for section slides

---
title: "My Amazing Presentation"
author: "Alice"
format:
  revealjs: default
---

## Slide 1

* Bullet 1
* Bullet 2

# New Section slide

## Slide 2

Some very insightful point I wish to make at this point in the presentation

reveal.js presentations

If you want to start a slide without a title, you can use --- to indicate the start of a slide without one

---
title: "My Amazing Presentation"
author: "Alice"
format:
  revealjs: default
---

## Slide 1

* Bullet 1
* Bullet 2

---

This slide started without a title

reveal.js presentations

If you want to add comments to your Quarto documents, you can’t use # as that is interpretted as Markdown. Instead we can use the HTML comment

Anything between the <!-- and --> will be ignored - can span multiple lines!

---
title: "My Amazing Presentation"
author: "Alice"
format:
  revealjs: default
---

<!-- This is a comment -->

## Slide 1

* Bullet 1
* Bullet 2

Defining blocks

Several features require you to define blocks of content

These blocks are called divs, a concept from HTML

We start and end a block with three or more :

## Slide title

:::

This is a block

:::

Defining blocks

It is important that you close a block, otherwise things will go wrong

Defining blocks — nesting

If you want to nest one block within another, the outermost block must use at least one more : than an inner block

## Slide title

::::

This is the outer block

:::

This is a block inside the other block

:::

::::

Blocks — classes & arguments

We can add a class and options to a block by wrapping them in { }

Arguments to the class are passed inside the { } as well

## Slide title

:::: {.class argument=value}

This is the outer block

::: {.another_class}

This is a block inside the other block

:::

::::

Incremental bullets

Some people like to incrementally reveal bullets one-by-one

There are two ways to achieve this

1. globally for all slides using the incremental option in the YAML header

2. for individual slides using a block with the class .incremental

Incremental bullets

To use incremental bullets for all slides, set the incremental option to true in the YAML header

---
title: "My Amazing Presentation"
author: "Alice"
format:
  revealjs:
    incremental: true
---

Remember that incremental is an option to revealjs, so it must be nested beneath it using indentation, as shown above, with two spaces

Incremental bullets

To reveal bullets incrementally for selected slides, we use an incremental block

## Slide title

::: {.incremental}

* Amazing point 1!
* Another amazing point!

:::

Incremental bullets

If you have set incremental: true in the YAML header, you can turn this feature off for individual slides using the nonincremental class

## Slide title

::: {.nonincremental}

* Amazing point 1!
* Another amazing point!

:::

A pause

If you just want a pause in your slides before you move on to your next point, use . . . (three periods [punktum] sperated by spaces)

## Slide title

Some point I wanted to make that I want the audience to ponder

. . .

My next point after some pondering time

Columns

Another frequently used slide layout is to place content into columns

We can do that with nested blocks

• To turn columns on, use a block with class columns
• To start an actual column, use a block with class column
• Use argument width="50%" to set the relative width of the columns

## Slide title

:::: {.columns}                             <!-- start columns -->

::: {.column width="60%"}                   <!-- start column 1 -->

:::                                         <!-- end column 1 -->

::: {.column width="40%"}                   <!-- start column 2 -->

:::                                         <!-- end column 2 -->

::::                                        <!-- end columns -->

Themes

A theme is an entire set of styles that change how the presentation looks

Quarto provides access to several complete themese

We specify the theme we want to use in the YAML header using the theme option

---
title: "Presentation"
format:
  revealjs: 
    theme: dark
---

For a list of supported themes, see the section on reveal.js themes in Quarto’s documentation

You can also modify these themes or even make your own!

Executable code

We add executable R code using the standard Quarto code block markup

## How big are penguins?

Penguins are amazing birds that are quite big

```{r}
library("palmerpenguins")
library("ggplot2")

penguins |>
  ggplot(aes(x = body_mass_g, y = flipper_length_mm)) +
  geom_point()
```

Executable code

By default, the code for these chuks is not displayed (echoed) in the presentation

Turn temporarily show the code use the echo: true option in the chunk

## How big are penguins?

Penguins are amazing birds that are quite big

```{r}
#| echo: true                                          <!-- Here -->
library("palmerpenguins")
library("ggplot2")

penguins |>
  ggplot(aes(x = body_mass_g, y = flipper_length_mm)) +
  geom_point()
```

Executable code

You can also set this globally for all chunks in the YAML header

---
title: "Presentation"
format:
  revealjs: 
    theme: dark
execute:
  echo: true
---

---
title: "Presentation"
format:
  revealjs: 
    theme: dark
knitr:
  opts_chunk:
    echo: true
---

Going further

To find out more about what you can do with reveal.js slides consult the Quarto documentation for the revealjs format